{% include 'header.html' %}
	<h1>{{ title }}</h1>
	<form action="/survey/submit" method="post">
		{% csrf_token %}
		<input type="hidden" name="survey_id" value="{{ surveyID }}">
		{% for i, q in questions %}
			<h4 class="my-4">{{ i | add:1 }}. {{ q.content }}</h4>
			{% if q.questionType == 'Text' %}
	    	<div class="form-group"><input class="form-control" name="{{ q.id }}"/></div>
		    {% elif q.questionType == 'LongText' %}
	    	<div class="form-group"><textarea class="form-control" name="{{ q.id }}"/></textarea></div>
		    {% elif q.questionType == 'Dropdown' %}
	    	<div class="form-group"><select class="form-control" name="{{ q.id }}">
	    		{% for o in q.surveyoption_set.all %}
	    		<option value="{{ o.id }}">{{ o.value }}</option>
	    		{% endfor %}
	    	</select></div>
		    {% elif q.questionType == 'Checkbox' %}
	    	{% for o in q.surveyoption_set.all %}
	    	<div class="form-check"><label class="form-check-label"><input type="checkbox" class="form-check-input" name="{{ q.id }}" value="{{ o.id }}">{{ o.value }}</label></div>
	    	{% endfor %}
		    {% elif q.questionType == 'Rating' %}
	    	{% for o in q.surveyoption_set.all %}
	    	<div class="radio"><label><input type="radio" name="{{ q.id }}" value="{{ o.id }}"> {{ o.value }}</label></div>
	    	{% endfor %}
		    {% endif %}
	    {% endfor %}
	    <div class="form-group"><h4 class="my-4">Your email address:</h4><input class="form-control" type="text" name="email"></div>
	    <button type="submit" class="btn btn-primary my-4">Submit</button>
	    <div class="form-group" style="display: none;">
	        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#DeleteModal">Delete this record</button>
	        <div class="modal fade" id="DeleteModal">
	            <div class="modal-dialog">
	             <div class="modal-content">
	       
	                <!-- 模态框头部 -->
	                <div class="modal-header">
	                <h4 class="modal-title">Warning!</h4>
	                <button type="button" class="close" data-dismiss="modal">&times;</button>
	                </div>
	       
	                <!-- 模态框主体 -->
	                <div class="modal-body">
	                 Do you really want to delete this record?
	                </div>
	       
	                <!-- 模态框底部 -->
	                <div class="modal-footer">
	                <button type="submit" class="btn btn-primary" data-dismiss="modal">Yes</button>
	                <button type="button" class="btn btn-secondary" data-dismiss="modal">No</button>
	                </div>
	       
	             </div>
	            </div>
	        </div>
	    </div>
	</form>
{% include 'footer.html' %}